import React, { useState, useEffect,useRef } from 'react';
import { useNavigate, useSearchParams } from 'react-router-dom'
import axios from 'axios'
import { Sticky, Button } from 'react-vant'
// 获取当前时间的函数
function getCurrentTime() {
    let date = new Date();
    let hours = date.getHours();
    let minutes = date.getMinutes();

    minutes = (minutes < 10 ? '0' : '') + minutes;
    return `${hours}:${minutes}`;
}

export default function Diy() {
    const container = useRef<HTMLDivElement>(null)
    const [currentTime, setCurrentTime] = useState(getCurrentTime());
    const navigate = useNavigate()
    let [search] = useSearchParams()
    let [item, setItem] = useState({})
    let [y, setY] = useState([])
    let id = search.get('id')
    useEffect(() => {
        getinfo()
        gety()
    }, [])
    // 使用 useEffect 设置定时器
  
    let top = () => {
        navigate(-1)
    }
    let getinfo = async () => {
        // console.log(id);

        let { data: { data } } = await axios.get('http://127.0.0.1:3000/mxd_infoid', { params: { id } })
        // console.log(data);
        setItem(data)
    }
    let gety = async () => {
        let { data: { data } } = await axios.get('http://127.0.0.1:3000/mxd_getids', { params: { id } })
        // console.log(data);
        setY(data)

    }
    let update=()=>{
        navigate('/gg/editdiy?id='+id)
    }
    return (
        <div id='diy'>
            <Sticky>
           
            <div className="top">
            <p>
                <span>
                    <svg onClick={top} style={{ width: '30px', height: '35px', position: 'absolute', marginLeft: '5px' }} t="1724675809513" className="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2590" width="200" height="200"><path d="M670.6 861.6c-7.6 0-15.1-2.9-20.9-8.6L329.4 532.7c-11.6-11.5-11.6-30.3 0-41.8l320.2-320.2c5.8-5.8 13.3-8.6 20.9-8.6 7.5 0 15.1 2.9 20.9 8.6 11.5 11.5 11.5 30.2 0 41.8L392 511.8l299.4 299.4c11.5 11.6 11.5 30.3 0 41.8-5.7 5.7-13.3 8.6-20.8 8.6z" fill="#2c2c2c" p-id="2591"></path></svg>
                </span>
                <span style={{ marginLeft: '35px', marginTop: '10px', lineHeight: '33px', fontSize: '20px' }}>常见处方详情</span>
                <span onClick={update} style={{ height: '35px', position: 'absolute', marginLeft: '180px', top: '50px', fontSize: '15px', color: '#52BDFF' }}>编辑处方</span>
            </p>
            </div>
            </Sticky>
            <hr />
            <div className="big2">
                <p>初步诊断：{item.zd}</p>
                <p>处理意见：{item.yj}</p>
            </div>
            <div className="big3">
                <span className='rp'>Rp</span>
                {y.map(item => (
                    <div key={item._id} className="small">

                        <br />
                        <p>【代文】{item.name}</p>
                        <p>规格：{item.grade}</p>
                        <p>{item.usage}</p>
                    </div>
                ))}


            </div>
        </div>
    );
}
